<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">

<html><head><title>jstree.themes.js - jstree</title><link rel="stylesheet" type="text/css" href="../styles/main.css"><script language=JavaScript src="../javascript/main.js"></script><script language=JavaScript src="../javascript/prettify.js"></script><script language=JavaScript src="../javascript/searchdata.js"></script></head><body class="ContentPage" onLoad="NDOnLoad();prettyPrint();"><script language=JavaScript><!--
if (browserType) {document.write("<div class=" + browserType + ">");if (browserVer) {document.write("<div class=" + browserVer + ">"); }}// --></script>

<!--  Generated by Natural Docs, version 1.5 -->
<!--  http://www.naturaldocs.org  -->

<!-- saved from url=(0026)http://www.naturaldocs.org -->




<div id=Content><div class="CFile"><div class=CTopic id=MainTopic><h1 class=CTitle><a name="jstree.themes.js"></a>jstree.<wbr>themes.js</h1><div class=CBody><p>Controls the looks of jstree, without this plugin you will get a functional tree, but it will look just like an ordinary UL list</p><!--START_ND_SUMMARY--><div class=Summary><div class=STitle>Summary</div><div class=SBorder><table border=0 cellspacing=0 cellpadding=0 class=STable><tr class="SMain"><td class=SEntry><a href="#jstree.themes.js" >jstree.<wbr>themes.js</a></td><td class=SDescription>Controls the looks of jstree, without this plugin you will get a functional tree, but it will look just like an ordinary UL list</td></tr><tr class="SGroup"><td class=SEntry><a href="#$.jstree" >$.jstree.</a></td><td class=SDescription></td></tr><tr class="SVariable SIndent1 SMarked"><td class=SEntry><a href="#$.jstree.THEMES_DIR" id=link1 onMouseOver="ShowTip(event, 'tt1', 'link1')" onMouseOut="HideTip('tt1')">$.jstree.<wbr>THEMES_DIR</a></td><td class=SDescription>The location of all themes, this is used when setting a theme without supplying an URL (only by name). </td></tr><tr class="SClass"><td class=SEntry><a href="#jstree" >jstree</a></td><td class=SDescription></td></tr><tr class="SGroup SIndent1"><td class=SEntry><a href="#jstree.THEMES_options" >THEMES options</a></td><td class=SDescription></td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#jstree.config.themes.theme" >config.<wbr>themes.<wbr>theme</a></td><td class=SDescription><b>string</b> the name of the theme you want to use. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#jstree.config.themes.url" >config.<wbr>themes.url</a></td><td class=SDescription><b>mixed</b> the URL of the stylesheet of the theme you want to use. </td></tr><tr class="SVariable SIndent2 SMarked"><td class=SEntry><a href="#jstree.config.themes.dots" >config.<wbr>themes.dots</a></td><td class=SDescription><b>boolean</b> whether to show dots or not. </td></tr><tr class="SVariable SIndent2"><td class=SEntry><a href="#jstree.config.themes.icons" >config.<wbr>themes.<wbr>icons</a></td><td class=SDescription><b>boolean</b> whether to show icons or not. </td></tr><tr class="SGroup SIndent1"><td class=SEntry><a href="#jstree.THEMES_functions" >THEMES functions</a></td><td class=SDescription></td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#jstree.set_theme" id=link2 onMouseOver="ShowTip(event, 'tt2', 'link2')" onMouseOut="HideTip('tt2')">set_theme</a></td><td class=SDescription>Sets the tree theme. </td></tr></table></div></div><!--END_ND_SUMMARY--></div></div></div>

<div class="CGroup"><div class=CTopic><h3 class=CTitle><a name="$.jstree"></a>$.jstree.</h3></div></div>

<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="$.jstree.THEMES_DIR"></a>$.jstree.<wbr>THEMES_DIR</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>$.jstree.THEMES_DIR</td></tr></table></blockquote><p>The location of all themes, this is used when setting a theme without supplying an URL (only by name).&nbsp; Default is <u>false</u>.&nbsp; If left as <u>false</u> the path will be autodetected when the DOM is ready.&nbsp; The location of <u>jquery.jstree.js</u> is used for the autodetection.&nbsp; Normally you won&rsquo;t need to modify this (provided you leave the <u>themes</u> folder in the same folder as <u>jquery.jstree.js</u> and do not rename the file).&nbsp; If you decide to move the folder or rename the file, but still want to load themes by name, simply set this to the new location of the <u>themes</u> folder.</p><blockquote><pre class="prettyprint">&lt;script type=&quot;text/javascript&quot; src=&quot;jquery.jstree.js&quot;&gt;&lt;/script&gt;
&lt;script type=&quot;text/javascript&quot;&gt;$.jstree.THEMES_DIR = &quot;some/path/with-a-trailing-slash/&quot;;&lt;/script&gt;</pre></blockquote></div></div></div>

<div class="CClass"><div class=CTopic><h2 class=CTitle><a name="jstree"></a>jstree</h2><div class=CBody><!--START_ND_SUMMARY--><div class=Summary><div class=STitle>Summary</div><div class=SBorder><table border=0 cellspacing=0 cellpadding=0 class=STable><tr class="SGroup"><td class=SEntry><a href="#jstree.THEMES_options" >THEMES options</a></td><td class=SDescription></td></tr><tr class="SVariable SIndent1 SMarked"><td class=SEntry><a href="#jstree.config.themes.theme" >config.<wbr>themes.<wbr>theme</a></td><td class=SDescription><b>string</b> the name of the theme you want to use. </td></tr><tr class="SVariable SIndent1"><td class=SEntry><a href="#jstree.config.themes.url" >config.<wbr>themes.url</a></td><td class=SDescription><b>mixed</b> the URL of the stylesheet of the theme you want to use. </td></tr><tr class="SVariable SIndent1 SMarked"><td class=SEntry><a href="#jstree.config.themes.dots" >config.<wbr>themes.dots</a></td><td class=SDescription><b>boolean</b> whether to show dots or not. </td></tr><tr class="SVariable SIndent1"><td class=SEntry><a href="#jstree.config.themes.icons" >config.<wbr>themes.<wbr>icons</a></td><td class=SDescription><b>boolean</b> whether to show icons or not. </td></tr><tr class="SGroup"><td class=SEntry><a href="#jstree.THEMES_functions" >THEMES functions</a></td><td class=SDescription></td></tr><tr class="SFunction SIndent1 SMarked"><td class=SEntry><a href="#jstree.set_theme" id=link3 onMouseOver="ShowTip(event, 'tt2', 'link3')" onMouseOut="HideTip('tt2')">set_theme</a></td><td class=SDescription>Sets the tree theme. </td></tr></table></div></div><!--END_ND_SUMMARY--></div></div></div>

<div class="CGroup"><div class=CTopic><h3 class=CTitle><a name="jstree.THEMES_options"></a>THEMES options</h3></div></div>

<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="jstree.config.themes.theme"></a>config.<wbr>themes.<wbr>theme</h3><div class=CBody><p><b>string</b> the name of the theme you want to use.&nbsp; Default is <u>default</u>.</p></div></div></div>

<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="jstree.config.themes.url"></a>config.<wbr>themes.url</h3><div class=CBody><p><b>mixed</b> the URL of the stylesheet of the theme you want to use.&nbsp; Default is <u>false</u>.&nbsp; If left as <u>false</u> the location will be autodetected using <a href="#$.jstree.THEMES_DIR" class=LVariable id=link4 onMouseOver="ShowTip(event, 'tt1', 'link4')" onMouseOut="HideTip('tt1')">$.jstree.THEMES_DIR</a>.</p></div></div></div>

<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="jstree.config.themes.dots"></a>config.<wbr>themes.dots</h3><div class=CBody><p><b>boolean</b> whether to show dots or not.&nbsp; Default is <u>true</u>.&nbsp; The chosen theme should support this option.</p></div></div></div>

<div class="CVariable"><div class=CTopic><h3 class=CTitle><a name="jstree.config.themes.icons"></a>config.<wbr>themes.<wbr>icons</h3><div class=CBody><p><b>boolean</b> whether to show icons or not.&nbsp; Default is <u>true</u>.</p></div></div></div>

<div class="CGroup"><div class=CTopic><h3 class=CTitle><a name="jstree.THEMES_functions"></a>THEMES functions</h3></div></div>

<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="jstree.set_theme"></a>set_theme</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>set_theme : function (</td><td class=PParameter nowrap>theme_name,</td></tr><tr><td></td><td class=PParameter nowrap>theme_url</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Sets the tree theme.&nbsp; This function is automatically called at construction with the settings specified in <a href="#jstree.config.themes.theme" class=LVariable id=link5 onMouseOver="ShowTip(event, 'tt3', 'link5')" onMouseOut="HideTip('tt3')">config.themes.theme</a> and &lt;config.themes.theme.url&gt;.</p><h4 class=CHeading>Parameters</h4><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>theme_name</td><td class=CDLDescription>the name of the theme to apply</td></tr><tr><td class=CDLEntry>theme_url</td><td class=CDLDescription>the URL of the stylesheet - leave this blank for autodetect</td></tr></table><h4 class=CHeading>Example</h4><blockquote><pre class="prettyprint">// Set the theme and autodetect the location
$(&quot;#div1&quot;).jstree(&quot;set_theme&quot;,&quot;classic&quot;);
// A custom theme. Please note that if you place your own theme in the _themes_ folder ot will be autodetected too.
$(&quot;#div2&quot;).jstree(&quot;set_theme&quot;,&quot;custom-theme&quot;,&quot;/some/path/theme.css&quot;);</pre></blockquote></div></div></div>

</div><!--Content-->


<div id=Footer>Copyright &copy; 2010 Ivan Bozhanov&nbsp; &middot;&nbsp; Updated March 20th, 2011&nbsp; &middot;&nbsp; <a href="http://www.naturaldocs.org">Generated by Natural Docs</a></div><!--Footer-->


<div id=Menu><div class=MTitle>jstree<div class=MSubTitle>jquery treeview plugin</div></div><div class=MEntry><div class=MFile><a href="_usage-txt.html">USAGE</a></div></div><div class=MEntry><div class=MFile><a href="_license-txt.html">LICENSE</a></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent1')">Core</a><div class=MGroupContent id=MGroupContent1><div class=MEntry><div class=MFile><a href="jstree-core-js.html">jstree.<wbr>core.js</a></div></div><div class=MEntry><div class=MFile><a href="vakata-js.html">Helper functions</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent2')">Plugins</a><div class=MGroupContent id=MGroupContent2><div class=MEntry><div class=MFile id=MSelected>jstree.<wbr>themes.js</div></div><div class=MEntry><div class=MFile><a href="jstree-ui-js.html">jstree.<wbr>ui.js</a></div></div></div></div></div><div class=MEntry><div class=MFile><a href="_lib/jquery-js.html">_lib\<wbr>jquery.js</a></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent3')">Index</a><div class=MGroupContent id=MGroupContent3><div class=MEntry><div class=MIndex><a href="../index/General.html">Everything</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Events.html">Events</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Files.html">Files</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Functions.html">Functions</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Variables.html">Variables</a></div></div><div class=MEntry><div class=MIndex><a href="../index/Classes.html">Classes</a></div></div></div></div></div><script type="text/javascript"><!--
var searchPanel = new SearchPanel("searchPanel", "HTML", "../search");
--></script><div id=MSearchPanel class=MSearchPanelInactive><input type=text id=MSearchField value=Search onFocus="searchPanel.OnSearchFieldFocus(true)" onBlur="searchPanel.OnSearchFieldFocus(false)" onKeyUp="searchPanel.OnSearchFieldChange()"><select id=MSearchType onFocus="searchPanel.OnSearchTypeFocus(true)" onBlur="searchPanel.OnSearchTypeFocus(false)" onChange="searchPanel.OnSearchTypeChange()"><option  id=MSearchEverything selected value="General">Everything</option><option value="Classes">Classes</option><option value="Events">Events</option><option value="Files">Files</option><option value="Functions">Functions</option><option value="Variables">Variables</option></select></div></div><!--Menu-->



<!--START_ND_TOOLTIPS-->
<div class=CToolTip id="tt1"><div class=CVariable><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td>$.jstree.THEMES_DIR</td></tr></table></blockquote>The location of all themes, this is used when setting a theme without supplying an URL (only by name). </div></div><div class=CToolTip id="tt2"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class="Prototype prettyprint"><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>set_theme : function (</td><td class=PParameter nowrap>theme_name,</td></tr><tr><td></td><td class=PParameter nowrap>theme_url</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Sets the tree theme. </div></div><div class=CToolTip id="tt3"><div class=CVariable><b>string</b> the name of the theme you want to use. </div></div><!--END_ND_TOOLTIPS-->




<div id=MSearchResultsWindow><iframe src="" frameborder=0 name=MSearchResults id=MSearchResults></iframe><a href="javascript:searchPanel.CloseResultsWindow()" id=MSearchResultsWindowClose>Close</a></div>


<script language=JavaScript><!--
if (browserType) {if (browserVer) {document.write("</div>"); }document.write("</div>");}// --></script></body></html>